{% include 'JDXJ/JDXJ_index.html' %}

<div class="am-cf admin-main">
  {% include 'sidebar.html' %}
  <!-- content start -->
  <div class="admin-content">
    <div class="admin-content-body">
      <div class="am-cf am-padding">
        <div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">基础数据</strong></div>
      </div>
      <div class="am-g" style="position: absolute;height: 100%;right: 0px;left: 260px;width: auto;">

        {% include 'JDXJ/JCSJ/JDXJ_JCSJ_SIDEBAR.html' %}

        <div class="am-u-sm-10" style="position: absolute;width:auto;right:0;left: 200px;height:85%;overflow-y: scroll;">
         <!--  <div class="am-u-sm-12 am-u-md-6">
            <div class="am-btn-toolbar">
              <div class="am-btn-group am-btn-group-xs">
                <button style="margin: 0 20px" type="button" class="am-btn am-btn-default am-btn-xs am-text-secondary" onclick="back_to()">返回</button>
              </div>
            </div>
          </div> -->
          <div class="am-u-sm-12 am-u-md-12 " >
            <div class="am-tabs am-margin" data-am-tabs>
              <ul class="am-tabs-nav am-nav am-nav-tabs">
               <!--  <li class="am-active">
                  <a href="#tab1">上部结构</a>
                </li>
                <li>
                  <a href="#tab2">下部结构</a>
                </li>
                <li>
                  <a href="#tab3">桥面系</a>
                </li> -->
                {% for row in rows %}
                <li>
                  <a href="#tab{{  row.id  }}">{{  row.systemName  }}</a>
                </li>
                {% endfor %}

              </ul>

              <div class="am-tabs-bd">
              {% for row in rows %}
                <div class="am-tab-panel am-fade am-in" id="tab{{  row.id  }}">
                  <table id="grid1" class="am-table am-table-striped am-table-hover table-main am-table-compact am-text-nowrap">
                    <thead>
                      <tr>
                        <th class="table-title">设备ID</th>
                        <th class="table-title">设备类别</th>
                        <th class="table-title">状态</th>
                        <th class="table-title">操作</th>
                      </tr>
                    </thead>
                    <tbody>
                      {% for obj in objs %}
                      {% if obj.systemName_id == row.id %}
                      <tr class="odd" >
                      <td class="sorting_1" >{{ obj.id }}</td>
                      <td class="sorting_1" >{{ obj.deviceName }}</td>
                      <td class="sorting_1" >{{ obj.status }}</td>
                      <td >
                        <div class="am-btn-toolbar">
                          <div class="am-btn-group am-btn-group-xs">
                            <button class="am-btn am-btn-default am-btn-xs am-text-secondary button_click" onclick="see_component({{ obj.systemName_id }},{{ obj.id }})">查看</button>
                          </div>
                        </div>
                      </td>
                      </tr>
                      {% endif %}
                      {% endfor %}
                    </tbody>
                  </table>
                </div>
              {% endfor %}
              </div>
            </div>

          </div>

        </div>

      </div>
    </div>
  </div>
</div>
{% include 'footer.html' %}
<!--[if lt IE 9]>
<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
<script src="http://cdn.staticfile.org/modernizr/2.8.3/modernizr.js"></script>
<script src="assets/js/amazeui.ie8polyfill.min.js"></script>
<![endif]-->

<!--[if (gte IE 9)|!(IE)]><!-->
<script src="/static/assets/js/jquery.min.js"></script>
<!--<![endif]-->
<script src="/static/assets/js/amazeui.min.js"></script>
<script src="/static/assets/js/amazeui.tree.js"></script>
<script type="text/javascript" src="/static/assets/js//layer.js"></script>
<script src="/static/assets/datatables/amazeui.datatables.min.js"></script>
<script src="/static/assets/dialog/amazeui.dialog.min.js"></script>
<link rel="stylesheet" type="text/css" href="/static/assets/css/amazeui.tree.css" />
<script src="/static/assets/js/app.js"></script>
<style type="text/css">
  .li_a {
    color: #5c5c5c;
  }
</style>
<script type="text/javascript">
  $.ajaxSetup({
    data: {csrfmiddlewaretoken: '{{ csrf_token }}' },
    });
  $("#collapse-nav8").addClass("am-in");
  $("#jdxj").removeClass("am-collapsed");
  $("#jdxjjcsj").css("color", "#3399CC");
  $("#jcsjsbxq").css("color", "#3399CC");
  $("#qlsjOldlb").removeClass("li_a");

  // function back_to(){
  //   window.location.href='/JDXJ_JCSJ_SBXQ/';
  // }
  function see_component(systemid,devienameid){
    window.location.href='/JDXJ_JCSJ_SBXQ_SEE/?systemid=' + systemid + '&devienameid=' + devienameid ;
  }
</script>

</body>

</html>